<template>
  <div class="checklists">
    <div class="lists" v-if="!iSshow">
      <van-notice-bar
          mode="closeable"
          background="-moz-linear-gradient(90deg,#F83600 0%,#F9D423 100%)"
          style="height: 40px"
      >徽商银行股份有限公司计划为您向我司申请投保（分行级/总行级）疾病身故/全残保障，为保障您的权益，请您如实填写健康告知内容。
      </van-notice-bar>
      <van-panel title="待补充信息" class="paneltitle"/>
      <van-form ref="form" :disabled="isDisabled">
        <van-field
            v-model.number="form.age"
            name="年龄"
            label="年龄（周岁）"
            placeholder="年龄"
            required
            :rules="ageRules"
            type="number"
            input-class="custom-label"
        />
        <van-field
            readonly
            clickable
            name="性别"
            :value="genderText"
            label="性别"
            placeholder="点击选择性别"
            required
            @click="showPicker = true"
            :rules="[
            { required: true, message: '请填写年龄', trigger: 'change' },
          ]"
        />
        <van-popup v-model="showPicker" position="bottom">
          <van-picker
              show-toolbar
              :columns="columnsSex"
              @confirm="onConfirm"
              @cancel="showPicker = false"
          />
        </van-popup>
        <van-field
            readonly
            clickable
            name="身高"
            :value="form.height"
            label="身高（米）"
            placeholder="点击选择身高"
            required
            @click="showPickerheight = true"
            :rules="[
            { required: true, message: '请选择身高', trigger: 'change' },
          ]"
        />
        <van-popup v-model="showPickerheight" position="bottom">
          <van-picker
              show-toolbar
              :columns="columnsHeight"
              @confirm="onConfirmheight"
              @cancel="showPickerheight = false"
          />
        </van-popup>
        <van-field
            v-model.number="form.weight"
            name="体重"
            label="体重（公斤）"
            placeholder="公斤"
            required
            :rules="weightRules"
            type="number"
        />
        <van-panel title="被保险人健康告知" class="paneltitle"/>
        <van-field
            name="radio"
            label="1.是否在其他保险公司正在申请及已生效的寿险累计保额是否大于等于 200 万?"
            required
            label-width="auto"
            :rules="[{ required: true, message: '请选择是或否' }]"
            class="longtext"
        >
          <template #input>
            <van-radio-group
                v-model="form.question1"
                direction="horizontal"
                :disabled="isDisabled"
            >
              <van-radio name="1" shape="square">是</van-radio>
              <van-radio name="0" shape="square">否</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-panel
            title="请在下方告知详述信息"
            class="paneltitleFu"
            v-if="FormQuestion1"
        />
        <van-field
            v-if="FormQuestion1"
            v-model="form.description1"
            type="textarea"
            label-width="auto"
            rows="1"
            autosize
            name="您正在申请及已生效的寿险累计保额"
            label="1、您正在申请及已生效的寿险累计保额"
            placeholder="请详细描述"
            class="longtext"
            required
            :rules="[{ required: true, message: '请填写详细描述' }]"
            :disabled="isDisabled"
        />

        <van-field
            name="radio"
            required
            label="2.被保险人在投保或复效申请时是否被保险公司拒保、廷期、附加条件承保、加费或者解除过保险合同?"
            label-width="auto"
            :rules="[{ required: true, message: '请选择是或否' }]"
            class="longtext"
        >
          <template #input>
            <van-radio-group
                v-model="form.question2"
                direction="horizontal"
                :disabled="isDisabled"
            >
              <van-radio name="1" shape="square">是</van-radio>
              <van-radio name="0" shape="square">否</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-panel
            title="请在下方告知详述信息"
            class="paneltitleFu"
            v-if="FormQuestion2"
        />
        <van-field
            v-if="FormQuestion2"
            v-model="form.description2"
            type="textarea"
            rows="1"
            autosize
            name="您被保险公司拒保、延期、附加条件承保、加费或者解除过保险合同原因"
            label="2、您被保险公司拒保、延期、附加条件承保、加费或者解除过保险合同原因"
            placeholder="请详细描述"
            label-width="auto"
            class="longtext"
            required
            :rules="[{ required: true, message: '请填写详细描述' }]"
            :disabled="isDisabled"
        >
        </van-field>

        <van-field
            name="radio"
            label="3.是否曾申请或获得癌症、重大疾病保险或金额大于 5000元的医疗险理赔?"
            required
            label-width="auto"
            :rules="[{ required: true, message: '请选择是或否' }]"
            class="longtext"
        >
          <template #input>
            <van-radio-group
                v-model="form.question3"
                direction="horizontal"
                :disabled="isDisabled"
            >
              <van-radio name="1" shape="square">是</van-radio>
              <van-radio name="0" shape="square">否</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-panel
            title="请在下方告知详述信息"
            class="paneltitleFu"
            v-if="FormQuestion3"
        />
        <van-field
            v-if="FormQuestion3"
            v-model="form.description3"
            type="textarea"
            rows="1"
            autosize
            name="您具体理赔申请病因"
            label="3、您具体理赔申请病因"
            placeholder="请详细描述"
            label-width="auto"
            class="longtext"
            required
            :rules="[{ required: true, message: '请填写详细描述' }]"
            :disabled="isDisabled"
        />

        <van-field
            name="radio"
            label="4.是否有参加赛车、赛马、飞行、跳伞、攀岩、潜水、探险或特技活动等高风险运动的啫好?"
            required
            label-width="auto"
            :rules="[{ required: true, message: '请选择是或否' }]"
            class="longtext"
        >
          <template #input>
            <van-radio-group
                v-model="form.question4"
                direction="horizontal"
                :disabled="isDisabled"
            >
              <van-radio name="1" shape="square">是</van-radio>
              <van-radio name="0" shape="square">否</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-panel
            title="请在下方告知详述信息"
            class="paneltitleFu"
            v-if="FormQuestion4"
        />
        <van-field
            v-if="FormQuestion4"
            v-model="form.description4"
            type="textarea"
            rows="1"
            autosize
            name="高风险运动项目"
            label="4、高风险运动项目"
            placeholder="请详细描述"
            label-width="auto"
            class="longtext"
            required
            :rules="[{ required: true, message: '请填写详细描述' }]"
            :disabled="isDisabled"
        />

        <van-field
            name="radio"
            label="5.是否患有或者曾经患有或者已经被告知有下列疾病和症状:
          (1)最近两年内单次住院7天以上或接受手术(剖腹产、门诊手术除外);6 个月内持续超过一周有下列病症;体重下
          降、发热(不明原因)、腹泻、咳血、血尿、肿块、淋巴结肿大或不寻常之皮肤溃烂?"
            label-width="auto"
            required
            :rules="[{ required: true, message: '请选择是或否' }]"
            class="longtext"
        >
          <template #input>
            <van-radio-group
                v-model="form.question5_1"
                direction="horizontal"
                :disabled="isDisabled"
            >
              <van-radio name="1" shape="square">是</van-radio>
              <van-radio name="0" shape="square">否</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-panel
            title="请在下方告知详述信息"
            class="paneltitleFu"
            v-if="FormQuestion5_1"
        />
        <van-field
            v-if="FormQuestion5_1"
            v-model="form.description5_1"
            type="textarea"
            rows="1"
            autosize
            name="诊断时间、诊断结果、目前状况（最近一次复查结果）"
            label="5、（1）诊断时间、诊断结果、目前状况（最近一次复查结果）"
            placeholder="请详细描述"
            label-width="auto"
            class="longtext"
            required
            :rules="[{ required: true, message: '请填写详细描述' }]"
            :disabled="isDisabled"
        />

        <van-field
            name="radio"
            label="
          (2)恶性肿瘤、前病变、冠心病、心肌梗寒、风湿性心脏病、肺心病、心肌病、心力衰竭(心功能不全 Ⅱ 级或以上
          )、高血压(收缩压>160mmHg或舒张压≥100mHg)、脑中风(脑出血、脑梗塞)、脑血管瘤、脑动静肽畸形、
          部肿瘤、癫痫、多发性硬化、重症肌无力、肺结节、呼吸衰竭、肝炎(不包括已治愈的甲肝和戊肝)、肝硬化.
          胰腺炎、溃疡性结肠炎、肠梗阻、慢性肾炎、肾病綜合征、肾功能衰竭、尿毒症、再生障碍性贫血、淋巴瘤、白
          血病、血友病、糖尿病、系统性红斑狼疮及其他自身免疫性疾病、艾滋病或艾滋病病青携带者、目前正在或曾经
          使用成瘾性药物或吸毒、先天性疾病、遗传性疾病、慢性酒精中毒、接受器官移植、任何身体或智力残疾、瘫瘐
          精神病、抑郁症或其他精神心理疾患、阿尔茨海默氏病、帕金森氏病?
         "
            label-width="auto"
            required
            :rules="[{ required: true, message: '请选择是或否' }]"
            class="longtext"
        >
          <template #input>
            <van-radio-group
                v-model="form.question5_2"
                direction="horizontal"
                :disabled="isDisabled"
            >
              <van-radio name="1" shape="square">是</van-radio>
              <van-radio name="0" shape="square">否</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-panel
            title="请在下方告知详述信息"
            class="paneltitleFu"
            v-if="FormQuestion5_2"
        />
        <van-field
            v-if="FormQuestion5_2"
            v-model="form.description5_2"
            type="textarea"
            rows="1"
            autosize
            name="诊断时间、诊断结果、目前状况（最近一次复查结果）"
            label="5、（2）诊断时间、诊断结果、目前状况（最近一次复查结果）"
            placeholder="请详细描述"
            label-width="auto"
            class="longtext"
            required
            :rules="[{ required: true, message: '请填写详细描述' }]"
            :disabled="isDisabled"
        />

        <van-field
            name="radio"
            label="6.女性适用:被保险人现在是否怀孕28周以上或产后1个月内?"
            label-width="auto"
            required
            :rules="[{ required: true, message: '请选择是或否' }]"
            class="longtext"
        >
          <template #input>
            <van-radio-group
                v-model="form.question6"
                direction="horizontal"
                :disabled="isDisabled"
            >
              <van-radio name="1" shape="square">是</van-radio>
              <van-radio name="0" shape="square">否</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-panel
            title="请在下方告知详述信息"
            class="paneltitleFu"
            v-if="FormQuestion6"
        />
        <van-field
            v-if="FormQuestion6"
            v-model="form.description6"
            type="textarea"
            rows="1"
            autosize
            name="现具体孕周或产后1个月内"
            label="6、现具体孕周或产后1个月内"
            placeholder="请详细描述"
            label-width="auto"
            class="longtext"
            required
            :rules="[{ required: true, message: '请填写详细描述' }]"
            :disabled="isDisabled"
        />
        <!-- <van-panel
          title="请告知详述信息"
          class="paneltitle"
          v-if="allQuestionsAreOne"
        /> -->
        <div style="margin: 16px; height: 60px">
          <van-button
              block
              type="info"
              native-type="submit"
              @click="onSubmit"
              size="normal"
              :disabled="isDisabledFace"
              class="onButton"
          >人脸验证
          </van-button>
        </div>
      </van-form>
      <div style="margin: 16px; height: 60px; padding-bottom: 20px">
        <van-button
            block
            type="info"
            @click="FindFaceResult"
            size="normal"
            class="onButton"
            :loading="isLoadingShow"
            loading-text="加载中..."
        >下一步
        </van-button>
        <!-- <van-button :loading="true" type="info" loading-text="加载中..." @click="dianji">下一步111</van-button> -->
      </div>
    </div>
    <div v-else class="AsginHeight">
      <iframe :src="src" frameborder="0" width="100%" height="100%"></iframe>
    </div>
    <!-- <van-loading type="spinner" size="24px" /> -->
  </div>
</template>

<script>
import {findSchemeUrl, findFaceResult, handSign} from "@/api/list";
import moment from "moment";
import throttle from "@/utils/throttle"

export default {
  props: {
    formdata: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      form: {
        policyName: "徽商银行股份有限公司",
        name: "",
        age: "",
        gender: "",
        height: "",
        weight: "",
        idType: "",
        idNumber: "",
        question1: "",
        question2: "",
        question3: "",
        question4: "",
        question5_1: "",
        question5_2: "",
        question6: "",
        description1: "",
        description2: "",
        description3: "",
        description4: "",
        description5_1: "",
        description5_2: "",
        description6: "",
        eleSignStr: "",
      },
      OpenidValue: "",
      iSshow: false,
      // src: "/AnySignMiniCoreV2.4.8 逐字签名/api_demo.html",
      src: "./AnySignMiniCore/api_demo.html",
      columnsSex: [
        {text: "男", value: "0"},
        {text: "女", value: "1"},
      ],
      showPicker: false,
      showPickerheight: false,
      Frequency: 0,
      columnsHeight: this.generateColumns(),
      genderText: null,
      isDisabled: false,
      ageRules: [
        {required: true, message: "请输入年龄", trigger: "onBlur"},
        {
          validator: (val) => {
            return /^\d{1,3}$/.test(val);
          },
          message: "年龄只能输入数字最多三位数",
          trigger: "onBlur",
        },
      ],
      weightRules: [
        {required: true, message: "请输入体重（公斤）", trigger: "onBlur"},
        {
          validator: (val) => {
            return /^\d{1,3}$/.test(val);
          },
          message: "体重只能输入数字（输入公斤）",
          trigger: "onBlur",
        },
      ],
      isDisabledFace: false,
      isLoadingShow: false
    };
  },
  computed: {
    // allQuestionsAreOne() {
    //   return [
    //     this.form.question1,
    //     this.form.question2,
    //     this.form.question3,
    //     this.form.question4,
    //     this.form.question5_1,
    //     this.form.question5_2,
    //     this.form.question6,
    //   ].some((question) => question === "1");
    // },
    FormQuestion1() {
      return [this.form.question1].some((question) => question === "1");
    },
    FormQuestion2() {
      return [this.form.question2].some((question) => question === "1");
    },
    FormQuestion3() {
      return [this.form.question3].some((question) => question === "1");
    },
    FormQuestion4() {
      return [this.form.question4].some((question) => question === "1");
    },
    FormQuestion5_1() {
      return [this.form.question5_1].some((question) => question === "1");
    },
    FormQuestion5_2() {
      return [this.form.question5_2].some((question) => question === "1");
    },
    FormQuestion6() {
      return [this.form.question6].some((question) => question === "1");
    },
  },
  mounted() {
  },
  created() {
    console.log("查看formdata", this.formdata);
    this.OpenidValue = window.sessionStorage.getItem("sh-openid");
    this.getByIdcard(this.formdata.idNumber);
    window.addEventListener("message", this.receiveMessage, false);
  },
  beforeDestroy() {
    window.removeEventListener("message", this.receiveMessage);
  },
  methods: {
    generateColumns() {
      const columns = [];
      for (let i = 1.0; i <= 2.5; i += 0.1) {
        columns.push({
          text: i.toFixed(1),
          value: i.toFixed(1),
        });
      }
      return columns;
    },
    formatBirthDate(idNumber) {
      // 提取出生日期部分
      const birthDateString = idNumber.substr(6, 8);
      // 确保提取的部分为8位数字
      if (!/^\d{8}$/.test(birthDateString)) {
        // 不符返回空字符
        return "";
      }
      // 格式化日期
      const year = birthDateString.substring(0, 4);
      const month = birthDateString.substring(4, 6);
      const day = birthDateString.substring(6, 8);
      return `${year}-${month}-${day}`;
    },
    onSubmit() {
      let {name, idNumber} = this.formdata;
      // console.log('this.formdata',name,idNumber,OpenidValue);

      // alert("onSubmit openID:" + this.OpenidValue);
      let objData = {
        openId: this.OpenidValue,
        birthday: this.formatBirthDate(idNumber),
        sex: this.form.gender,
        name: name,
        idNo: idNumber,
      };

      this.$refs.form
          .validate()
          .then(() => {
            //todo 调用人脸识别接口
            findSchemeUrl(objData)
                .then((res) => {
                  console.log("findSchemeUrl", res);
                  // todo 获取businessCode
                  //判断是否获取成功
                  if (res.code == 1 && res.data != null) {
                    this.Frequency++;
                    sessionStorage.setItem("Frequency", this.Frequency);
                    let countNum = sessionStorage.getItem("Frequency");
                    console.log("Frequency", this.Frequency);
                    if (countNum > 3) {
                      this.$dialog.alert({
                        title: "温馨提示",
                        message: "因您人脸识别多次失败，请联系保险公司服务人员处理,或者可以再次重新填写",
                      });
                      // alert(
                      //     "因您人脸识别多次失败，请联系保险公司服务人员处理,或者可以再次重新填写"
                      // );
                      // window.opener = null;
                      // // window.open("about:blank", "_self");
                      // window.location.replace('about:blank');
                      // window.close();
                      this.$emit("onShowCheck2", true);
                    } else {
                      const dataObject = JSON.parse(res.data);
                      this.businessCode = dataObject.businessCode;
                      this.linkUrl = dataObject.link;
                      console.info("link:" + this.linkUrl);
                      // alert("link:" + this.linkUrl);
                      window.location.href = this.linkUrl;

                      // 人脸通过后禁用表单
                      this.isDisabled = true;
                    }
                  } else {
                    this.$dialog.alert({
                      title: "温馨提示",
                      message: "人脸识别失败，请重新进行人脸识别！",
                    });
                  }
                })
                .catch((err) => {
                  console.log(err);
                });
            this.$dialog.alert({
              title: "成功提示",
              message: "提交成功",
            });
          })
          .catch(() => {
            // console.log(this.$refs.form);
            this.$dialog.alert({
              title: "温馨提示",
              message: "还有信息未填写，请补全！",
            });
          });
    },
    // todo 调用人脸识别结果接口
    // FindFaceResult() {
    FindFaceResult: throttle(function () {
      console.log('dayin');

      // todo 222 - 没有点击过人脸识别按钮，这里要做一个提示，先进行人脸识别，先点击人脸识别按钮
      // var businessCode = 'cc523bee716c41efae3ff4e0d6feec07'
      // this.businessCode = "a9a1ec53650543bb9aca08b73018c952";
      // this.businessCode = "bfbcf9532b944939971f43fb5ae3b2d3";

      // alert("FindFaceResult enter businessCode:" + this.businessCode);
      var isDebugFlag = this.$isDebugFlag;
      if (isDebugFlag) {
        // this.businessCode = "bfbcf9532b944939971f43fb5ae3b2d3";
        this.businessCode = "c730e4953a834392b531e234ba7c34fc";
        // this.businessCode = "1c03f104fd974ac7acd73ce800e708ba";
      }
      let data = {businessCode: this.businessCode};

      if (
          this.businessCode === null ||
          this.businessCode === undefined  ||
          this.businessCode === "" ||
          !this.businessCode
      ) {
        // alert("没有进行人脸识别");
        this.$dialog.alert({
          title: "温馨提示",
          message: "未进行人脸验证",
        });
        // console.info("没有进行人脸识别");
        this.isLoadingShow = false
        return;
      }
      // alert("findFaceResult sendserver")
      // 人脸识别结果接口

      this.isLoadingShow = true
      findFaceResult(data)
          .then((res) => {
            console.log("findFaceResult", res);
            // alert(res);
            // 判断结果是不是手签完成并成功
            // 直接跳转到手签页面
            // todo
            if (!this.businessCode) {
              this.$dialog.alert({
                title: "温馨提示",
                message: "您还没有进行人脸验证！请先人脸验证再下一步",
              });
              // alert("您还没有进行人脸验证！请先人脸验证再下一步");
              return;
            }
            console.log("人脸操作");

            const {success, code, message, data} = JSON.parse(res.obj);

            if (
                success == true &&
                code == 1 &&
                message == "success" &&
                data != null
            ) {
              const {result} = JSON.parse(data);
              console.log("data.result:" + result);
              if (result == 1 || result == "1") {
                console.log("人脸成功");
                this.Frequency = 0;
                sessionStorage.setItem("Frequency", this.Frequency);
                this.isDisabledFace = true;
                this.isLoadingShow = false

                // alert("findFaceResult");
                //直接到手签页面进行手签操作
                setTimeout(() => {
                  this.iSshow = true;
                }, 300);
              } else {
                console.info(" 1 温馨提示 else")

                this.$dialog.alert({
                  title: "温馨提示",
                  message: "人脸识别失败",
                });
              }
              this.isLoadingShow = false
            } else {

              console.info(" 温馨提示 else")
              this.$dialog.alert({
                title: "温馨提示",
                message: "人脸识别失败",
              });
              this.isLoadingShow = false

            }
          })
          .catch((err) => {
            console.log('err', err);
            this.isLoadingShow = false
          });
    }, 1000),
    //处理接收的消息
    receiveMessage(event) {
      // alert("receiveMessage");
      let data = event.data;
      console.log("子组件传递过来的数据", data.eleSignStr);
      // console.log('传递过来的数据', event)
      if (data.eleSignStr) {
        // alert("data.eleSignStr not null");
        // todo 注释掉
        let mergedObj = Object.assign({}, this.form, this.formdata, {
          signDate: moment(new Date()).format("YYYY-MM-DD HH:mm:ss"),
          eleSignStr: data.eleSignStr,
        });
        // console.log("mergedObj", mergedObj);
        if(mergedObj.question1=="0"||mergedObj.question1==0){
          mergedObj.description1=''
        }
        if(mergedObj.question2=="0"||mergedObj.question2==0){
          mergedObj.description2=''
        }
        if(mergedObj.question3=="0"||mergedObj.question3==0){
          mergedObj.description3=''
        }
        if(mergedObj.question4=="0"||mergedObj.question4==0){
          mergedObj.description4=''
        }
         if(mergedObj.question5_1=="0"||mergedObj.question5_1==0){
          mergedObj.description5_1=''
        }
        if(mergedObj.question5_2=="0"||mergedObj.question5_2==0){
          mergedObj.description5_2=''
        }
        if(mergedObj.question6=="0"||mergedObj.question6==0){
          mergedObj.description6=''
        }
        // 提交所有已填写的数据
        handSign(mergedObj).then((res) => {
          // alert("handSign res:"+res.code);
          console.log("签名接口返回的数据", res);
          let {code, obj, success, msg} = res;
          if (res.code == 1 && res.obj != null) {
            let pdfUrl = res.obj;
            console.log("pdfUrl", pdfUrl);
            // alert("pdfUrl:"+pdfUrl)
            // alert("push param signany pdfUrl:"+pdfUrl)
            this.$router.push({
              name: "signany", params: {
                idType: this.formdata.idType,
                name: this.formdata.name,
                idNumber: this.formdata.idNumber,
              }
            });
            this.$dialog.alert({
              title: "成功提示",
              message: "签名完成",
            });
          } else {
            this.iSshow = false;
            this.$dialog.alert({
              title: "温馨提示",
              message: "签名失败",
            });
          }
        });
      }
    },
    onConfirm(val) {
      console.log(val);
      this.form.gender = val.value;
      this.genderText = val.text;
      this.showPicker = false;
    },
    onConfirmheight(val) {
      console.log(val);
      this.form.height = val.value;
      this.showPickerheight = false;
    },
    getByIdcard(IdNO) {
      //根据身份证号码获取性别
      if (IdNO.length == 18) {
        let sex = IdNO.substr(16, 1);
        if (sex % 2 == 1) {
          this.form.gender = "0";
          this.genderText = "男";
          // console.log('gender--',sex,this.form);
        } else {
          this.form.gender = "1";
          this.genderText = "女";
          // console.log('gender--',sex,this.form);
        }
      }
      //根据身份证号码获取年龄
      if (IdNO.length == 18) {
        // age = myDate.getFullYear() - IdNO.substring(6, 10) - 1;
        const birthYear = parseInt(IdNO.substring(6, 10));
        const currentYear = new Date().getFullYear();
        const age = currentYear - birthYear;
        // console.log('age--',age);
        this.form.age = age;
      }
    },
  },
};
</script>

<style scoped lang="scss">
.checklists {
  height: 100%;

  ::v-deep .van-field__control {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    font-size: 17px !important;
  }

  ::v-deep .van-field__label {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    font-weight: bold;
    font-size: 17px !important;
  }

  ::v-deep .van-radio-group {
    height: 40px;
    line-height: 40px;
    font-size: 17px !important;
  }

  ::v-deep .van-cell:after {
    border-color: #c7c7c7;
  }

  .longtext {
    white-space: normal; /* 允许换行 */
    word-break: break-word; /* 断词换行 */
    overflow-wrap: break-word; /* 断词换行 */
    display: inline-block;
    width: 100%; /* 自适应宽度 */
    vertical-align: top; /* 垂直对齐顶部 */
    font-size: 17px !important;
  }

  .paneltitle {
    font-weight: bolder;
  }

  .van-cell {
    font-size: 20px !important;
  }

  .AsginHeight {
    height: 100%;
  }

  ::v-deep .van-cell--required::before {
    padding: 5px 0;
  }

  .checkList2Button1 {
    margin-bottom: 30px;
  }

  .onButton {
    font-size: 17px !important;
  }

  .paneltitleFu {
    font-size: 16px;

    .van-cell {
      color: rgb(228, 218, 64) !important;
    }
  }
}
</style>
